<%@page pageEncoding="UTF-8"
    session="false"
    trimDirectiveWhitespaces="true"
    isErrorPage="true"
    contentType="text/html"
    import="org.opencms.jsp.util.CmsJspStatusBean" %><%

    // initialize the error status bean
    CmsJspStatusBean cms = new CmsJspStatusBean(pageContext, request, response, exception);
    // select effect based on URI
    // to disable effects, set ani = 0
    int ani = 1 + (Math.abs(("".concat(cms.getRequestUri())).hashCode()) % 2);
%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><%= cms.keyStatus("error_message") %></title>
<style><%--
--%>*{box-sizing:border-box;margin:0}.logo{margin:0;display:block;height:50px;width:202px;text-indent:-9999px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='42' viewBox='0 0 170 42'%3E%3Cpath fill='%23b31b34' d='M29.86.5a20.42 20.42 0 00-11.84 3.79 20.46 20.46 0 00-4.88 4.76c-1.5-.17-2.96 0-4.43.44a11.81 11.81 0 00-8.54 9.78 12.15 12.15 0 004.4 11.13 12.13 12.13 0 008.48 2.6 20.1 20.1 0 007.34 6.3 20.91 20.91 0 0020.58-.78c1.01-.76 2.35-1.32 2.89-2.52.6-1.46-1-3.1-2.49-2.58-.18.07-.37.15-.53.27a16.91 16.91 0 01-23.6-1.86 12.27 12.27 0 006.58-8.5c.85-3.94-.47-8.23-3.4-11.01-.87-.87-1.9-1.48-3-2.03.9-1.03 1.93-2.06 3.07-2.84A16.84 16.84 0 0138.8 7c1.08.51 1.82 1.68 3.06 1.82 1.58.17 2.72-1.8 1.8-3.1a15.93 15.93 0 00-4.28-2.98A20.02 20.02 0 0029.86.5zm85.17 9.52c-2.3 0-5.03 2.65-5.08 4.96l.04 12.02c.01 2.36 2.7 5 5.04 5.04h10.02C126 32 127 31 126.99 30 127 29 126 28 125.04 28.03h-10.02c-.55-.07-1.02-.53-1.02-1.02l-.03-12.03c.03-.56.51-.99 1.05-.97h10.03C126 14 127 13 127.02 11.98 127 11 126 10 125.05 10.02zM158.03 14c-2.43-.08-5.07 2.83-5.02 5.42-.05 2.41 2.55 5.57 5.02 5.58l7-.04c.54.06.96.62 1 1.53-.04.85-.52 1.51-1 1.53h-10.08c-.97-.04-1.88.97-1.94 2.06.06.91.9 1.92 1.94 1.93h10.09c2.28-.03 4.96-3 4.96-5.52 0-2.48-2.61-5.5-4.96-5.48l-7.01-.01c-.61-.01-1.04-.65-1.03-1.58-.01-.8.53-1.42 1.03-1.44h10.02c.99.02 1.99-.98 1.95-1.97.04-1-.96-2-1.95-2zM133.99 14c-2.3 0-4.99 2.65-5 4.98V30c.01 1 1.01 2 2.04 2 .97 0 1.97-1 1.98-2V18.98c-.01-.5.51-.98 1.02-.95H137c.63-.03 1 .4 1 .95V30c0 1 1 2 2.01 2 .99 0 1.99-1 1.97-2V18.98c.02-.5.5-.98 1.05-.95h3.03c.55-.03.94.5.97.95V30c-.03 1 .97 2 2 2 .97 0 2.02-1 2-2V18.98c.02-2.29-2.66-4.98-4.97-4.98z'/%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M19.84 22.6a8.01 8.01 0 01-13.71 3.82 8.05 8.05 0 01-1.82-7.66 7.97 7.97 0 0112.89-3.84 8.03 8.03 0 012.62 7.68z' clip-rule='evenodd'/%3E%3Cpath fill='%23003082' fill-rule='evenodd' d='M37.02 10.02c-2.32-.03-5.03 2.67-5 4.96v12c-.06 2.35 2.66 5.02 5 5.02h9.02c2.25 0 4.97-2.72 4.96-4.98V15.29c.01-2.6-2.6-5.28-4.96-5.27zm0 3.97h9.01c.48.02.97.45.97 1l.02 12.03c-.02.48-.53.98-.99 1h-9.01c-.6-.03-.97-.42-.98-1.02l-.02-12.01c.03-.61.48-1 1-1.01zm59 .05C93.68 13.99 91 16.63 91 19v10.97C91 31 92 32 92.95 32c1.05 0 2.05-1 2.1-2.03L95.01 19c-.01-.62.49-.94 1.03-.98h7.01c.53-.03.97.48.98.98v10.97C103.98 31 105 32 106 31.93c.99.07 1.99-.93 2.02-1.96l.02-10.97c-.05-2.37-2.51-5-5.09-4.96zm-7.03 1.94C88.98 15 88.04 14 87.03 14H77.01c-2.27 0-5.01 2.66-4.98 4.99l.03 8.06C72 29.32 74.7 32 77 31.97l10.02.03C88 32 89 31 89 30.06 89 29 88 28 87.03 28.03l-10.02-.04c-.48 0-1.01-.71-1-1.55-.01-.76.44-1.44 1-1.44h10.02c.97 0 2.02-.95 1.96-2 .06-.95-.99-2-1.96-1.97l-10.02-.04c-.6.01-1.01-.6-1.03-1.57.02-.82.5-1.42 1.03-1.4h10.02c1-.02 1.95-1.02 1.96-2.04zm-35.97-.02c0 1.04.98 2.04 1.97 2.06h10.12c.6.08.88.46.92 1v8c-.02.45-.45.96-1.04 1.01h-9.03c-1.49-.05-2.97 1.45-2.94 2.96v3.98c0 1.03.98 2.03 1.98 2 1 .03 2.01-.97 2-2V32.9c0-.46.54-.86 1.06-.9h6.65c2.6-.01 5.3-2.67 5.3-4.99v-8c-.02-2.37-2.72-5.07-5-5.02h-9.99c-1.02-.05-1.99 1-2 1.95zM15.9 21.78a4.01 4.01 0 01-4.2 3.2A4.04 4.04 0 018 20.66a4 4 0 117.9 1.13z' clip-rule='evenodd'/%3E%3C/svg%3E") no-repeat;background-size:contain}.error,body,footer,header,main{display:flex;flex-direction:column}body{width:100vw;height:100vh;align-items:center;justify-content:center;color:#444;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;line-height:1}.wrapper{position:relative;z-index:200;margin-left:15px;margin-right:15px}.error{position:relative}.error>h1{margin:0;font-size:10rem;font-weight:700;color:#aaa}.error>h2{display:block;margin:0;font-size:2rem;color:#444;border-top:1px solid #ddd;padding:6px 0}main{line-height:1.4}main>div:first-child{font-weight:700}footer,main{margin-top:1rem}footer a{font-size:.7rem;color:#aaa;text-decoration:none;transition:color .5s}footer a:hover{color:#b31b34;transition:color .5s}@media only screen and (min-width:700.01px){.wrapper{margin-right:auto;margin-left:auto;min-width:670px;width:80%}.error>h2{display:inline-block;width:100%;position:absolute;text-align:right;left:0;font-size:2rem;bottom:49%;color:#444;border-top:none;border-bottom:1px solid #ddd;text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff}}<%

if (ani == 1) {
// "snow" animation CSS

%>@-webkit-keyframes ecs-fall{0%{top:-10%}100%{top:100%}}@keyframes ecs-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes ecs-shake{0%{transform:translateX(0) rotate(0) scale(1)}50%{transform:translateX(50px) rotate(360deg) scale(2);opacity:.5}}@keyframes ecs-shake{0%{transform:translateX(0) rotate(0) scale(1)}50%{transform:translateX(50px) rotate(360deg) scale(2);opacity:.5}}.ecs>span{position:fixed;top:-10%;z-index:100;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:ecs-fall,ecs-shake;animation-name:ecs-fall,ecs-shake;-webkit-animation-duration:10s,3s;animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-play-state:running,running}.ecs>span::after{content:"<%= cms.getStatusCode() %>";font-weight:700;color:#b31b34;font-size:1rem}.ecs>span:nth-child(odd){z-index:300}.ecs>span:nth-child(odd)::after{color:#144382}.ec0{left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.ec1{left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.ec2{left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.ec3{left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.ec4{left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.ec5{left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.ec6{left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.ec7{left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.ec8{left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.ec9{left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}<%

} else if (ani == 2) {
// "spin" animation CSS

%>@-webkit-keyframes spin{from{transform:rotateX(0)}to{transform:rotateX(720deg)}}@keyframes spin{from{transform:rotateX(0)}to{transform:rotateX(720deg)}}@-webkit-keyframes colorize{0%{color:#aaa}25%{color:#b31b34}75%{color:#144382}100%{color:#aaa}}@keyframes colorize{0%{color:#aaa}25%{color:#b31b34}75%{color:#144382}100%{color:#aaa}}.error>h1{display:inline-block;-webkit-animation-name:spin,colorize;animation-name:spin,colorize;-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-duration:4s;animation-duration:4s}<%

}
%></style>
</head><%----%>

<body>
<div class="wrapper"><%----%>

<header>
<a href="http://www.opencms.org" class="logo">Error</a>
<div class="error">
<h1><%= cms.getStatusCode() %></h1>
<h2><%= cms.keyStatus("error_message") %></h2>
</div>
</header><%----%>

<main>
<div><%= cms.getRequestUri() %></div>
<div><%= cms.keyStatus("error_description") %></div>
</main><%----%>

<footer>
<a href="http://www.opencms.org">This server runs OpenCms - the open source content management system!</a>
</footer><%----%>

</div><%

if (ani == 1) {
// "snow" animation HTML
%>
<span class="ecs" aria-hidden="true"><%----%>
  <span class="ec0"></span><%----%>
  <span class="ec1"></span><%----%>
  <span class="ec2"></span><%----%>
  <span class="ec3"></span><%----%>
  <span class="ec4"></span><%----%>
  <span class="ec5"></span><%----%>
  <span class="ec6"></span><%----%>
  <span class="ec7"></span><%----%>
  <span class="ec8"></span><%----%>
  <span class="ec9"></span><%----%>
</span>
<% } %>

</body>
</html>